doctype html
head
    meta(charset='utf-8')
    style.
        .container {
            width: 70%;
            margin: auto;
        }

        form {
            display: table;
            margin: auto;
        }

        label {
            margin-bottom: 10px;
        }

        .col-lg-1 {
            width: 10%;
            float: left;
        }
        .col-lg-6{
            width:50%;
            float:left;
        }

        .row{
            clear:both;
        }

        .element01 {
            width: 100%;
        }

        .element02 {
            color: #00f;
            background-color: #ddd;
        }

        .element03 {
            color: #00f;
        }

        .element04 {
            background-color: #ddd;
        }

        .element05 {
            border: 2px dotted #00f;
        }

        .element06 {
            border: none;
        }

        .element07 {
            font-family: "Courier New", Courier;
        }

        .element08 {
            font-size: 2em;
        }

        .element09 {
            font-size: 0.5em;
        }

        .element10 {
            font-weight: bold;
        }

        .element11 {
            padding: 1em;
        }

        .element12 {
            margin: 1em;
        }

        .element13 {
            text-align: right;
        }

        select{
            width:50%;
            height:34px;
        }
body
    .container
        .row
            include main.jade
        .row
            form
                h2 Label几种样式集合。
                h3 当前浏览器:
                label.element01 element01 : width:100%;
                br
                label.element02 element02 : color:blue;background-color: #ddd;
                br
                label.element03 element03 : color:#00f;
                br
                label.element04 element04 : background-color: #ddd;
                br
                label.element05 element05 : border: 2px dotted #00f;
                br
                label.element06 element06 : border: none;
                br
                label.element07 element07 : font-family: "Courier New", Courier;
                br
                label.element08 element08 : font-size: 2em;
                br
                label.element09 element09 : font-size: 0.5em;
                br
                label.element10 element10 : font-weight: bold;
                br
                label.element11 element11 : padding: 1em;
                br
                label.element12 element12 : margin: 1em;
                br
                label.element13 element13 : text-align: right;
        .row
            .col-lg-6
                .dropdown-left
                    select
                        option(value='chrome44') chrome 44
                        option(value='firefox35') firefox 35
                        option(value='ie7') ie 7
                        option(value='ie8') ie 8
                        option(value='ie9') ie 9
                        option(value='ie10') ie 10
                    .content
                        p chrome 44:
                        img(src='img/label/chrome44.png')

            .col-lg-6
                .dropdown-right
                    select
                        option(value='chrome44') chrome 44
                        option(value='firefox35') firefox 35
                        option(value='ie7') ie 7
                        option(value='ie8') ie 8
                        option(value='ie9') ie 9
                        option(value='ie10') ie 10
                    .content
                        p chrome 44:
                        img(src='img/label/chrome44.png')

    script(src='../bower_components/jquery/dist/jquery.js')
    script.
        $('select').on('change', function(){
            var name = $(this).find("option:selected").val();
            var $content = $('.content', $(this).parent())
            $('p', $content).html(name);
            $('img', $content).attr('src', 'img/label/'+name+'.png');
        })

        $('.selectEle').on('click', function () {
            var name = $(this).attr('data');
            location.href = location.href.substring(0, location.href.lastIndexOf("/") + 1) + name + ".html";
        })
